.w {
    width: 1200px;
    margin: auto;
}
.flex {
    display: flex;
}
.between {
    justify-content: space-between;
}
.around {
    justify-content: space-around;
}
.item-center {
    align-items: center;
}
.img-center {
    background-position: center center;
    background-repeat: no-repeat;
    background-size: cover;
}
.center {
    position: absolute;
    top: 50%;
    left: 50%;
    transform: translate(-50%, -50%);
}
.shadow {
    box-shadow: 0 0 10px rgba(220, 214, 214, 0.3);
}
.shadow-bottom {
    box-shadow: 0 5px 10px rgba(220, 214, 214, 0.3);
}
.small {
    font-size: 12px;
}
.middle {
    font-size: 13px;
}
.normal {
    font-size: 14px;
}
.large {
    font-size: 16px;
}
.black {
    color: #000;
}
.white {
    color: #fff;
}
.bold {
    font-weight: 600;
}
.ppp {
    overflow:hidden; 
    text-overflow:ellipsis;
    display:-webkit-box; 
    -webkit-box-orient:vertical;
    -webkit-line-clamp:1; 
    -webkit-line-clamp: var(--p);
}